let liArr = document.querySelectorAll(".imglisttwo li");
let imgName;
liArr.forEach(function (v, i) {
    v.onmouseover = function () {
        //    获取到每一个li里面的Img属性
        let imgUrl = v.children[0].src;
        // 图片地址里面最后一个/下标
        let start = imgUrl.lastIndexOf("/") + 1;
        // 图片地址里面最后一个.下标
        let end = imgUrl.lastIndexOf(".");
        //    全局变量获取字符串截取 全局变量这样移出也可以用
        imgName = imgUrl.slice(start, end);
        //    让图片移入时找到截取到的属性地址
        v.children[0].src = `../images/${imgName}-c.svg`;
        v.style.background = "#005be0";
    }
    v.onmouseout = function () {
        v.children[0].src = `../images/${imgName}.svg`;
        v.style.background = "#fff";
    }
})
let toTop = document.querySelector(".toTop");
toTop.onclick = function () {
    let timer = setInterval(function () {
        y = window.scrollY;
        //将滚动条滚动的高度赋值给变量，逐渐自减
        //y不断的减少
        y -= 100;
        //设置定时器不断执行滚动条位置，形成动画效果
        window.scrollTo(0, y);
        if (y <= 0) {
            //回到顶部后就清除定时器
            clearInterval(timer);
        }
    }, 20);
}
//高级版：刚开始时隐藏回到顶部按钮，滚动条滚动到300px时出现按钮    
window.onscroll = function () {
    if (window.scrollY >= 300) {
        toTop.style.display = "block"
    } else {
        toTop.style.display = "none"
    }
}


